<template>
	<view class="base-page">
		<view class="base-title">经营信息</view>
		<view class="mt-20">
			<view class="label-box">法人姓名：</view>
			 <!-- @blur="changeName" -->
			<input type="text" placeholder="请填写法人姓名" class="inp-box" :class="{'unactive':unActiveRule('merchantName')}" v-model="formData.merchantName">
		</view>
		<view class="mt-20">
			<view class="label-box">商户简称：</view>

			<input type="text" placeholder="需与实际品牌或商户名称相关" class="inp-box" :class="{'unactive':unActiveRule('merchantShortName')}" v-model="formData.merchantShortName">
		</view>
		<view class="tip-title">请按品牌+地址规范填写，如：太二酸菜鱼（厦门sms店）</view>
		<!-- <view>
			<view class="label-box">公司类型：</view>
			<uni-data-select class="select-box" placeholder="请选择公司类型" v-model="formData.companyType"
				:localdata="dirctionList.companyType" @change="changeCompany" :clear="false"></uni-data-select>
		</view> -->
		<view class="mt-20">
			<view class="label-box">所属行业：</view>
			<view class="flex item-center justify-between">
				<uni-data-select class="select-box level-box" style="width: 30%;"  :scrollText="`width:${sysW}px`" styleText="text-align:left;"  :class="{'unactive':unActiveRule('mccOneId')}" v-model="formData.mccOneId"
					:localdata="dirctionList.hfMccList" @change="changeCompany($event,'hfmcclevel1')"></uni-data-select>
				<uni-data-select class="select-box level-box" selctChange='level2-line'  :scrollText="`width:${sysW}px;left:${-(sysW/2)+ (sysW/3)/2}px;`" style="width: 30%;" styleText="text-align:left;" v-model="formData.mccTwoId"
					:localdata="dirctionList.level2" @change="changeCompany($event,'hfmcclevel2')"   :class="{'unactive':unActiveRule('mccTwoId')}"></uni-data-select>
				<uni-data-select class="select-box level-box"  selctChange='level3-line'  :scrollText="`width:${sysW}px;left:${-(sysW/2)- (sysW/3)/2}px;`" style="width: 30%;" styleText="text-align:left;" v-model="formData.mcc"
					:localdata="dirctionList.level3" @change="changeCompany($event,'hfmcclevel3')"   :class="{'unactive':unActiveRule('mcc')}"></uni-data-select>
			</view>
		
		</view>
		<view class="mt-20">
			<view class="label-box">商户logo：</view>
			<view style="margin:10px 0px 10px 100px; width: 80px;">
				<uni-file-picker limit="1" :image-styles="imageStyles" @delete="delImg($event,'logo')"
					v-model='logoFileList' @select="selectImg($event,'logo')">
					<view class="upload-box flex flex-col item-center justify-center"   :class="{'unactive':unActiveRule('logo')}">
						<uni-icons type="plusempty" size="27" color="rgba(51, 51, 51, 0.6)"></uni-icons>
						上传图片
					</view>
				</uni-file-picker>
			</view>

		</view>
	
		<!-- <view>
			<view class="label-box">营业执照图片：</view>
			<view style="margin: 10px auto; width: 80px;">
				<uni-file-picker limit="1" :image-styles="imageStyles" v-model='licensePicFileList'
					@select="selectImg($event,'licensePic')" @delete="delImg($event,'licensePic')">
					<view class="upload-box flex flex-col item-center justify-center">
						<uni-icons type="plusempty" size="27" color="rgba(51, 51, 51, 0.6)"></uni-icons>
						上传图片
					</view>
				</uni-file-picker>
			</view>
		</view>
		<view>
			<view class="label-box">营业执照编号：</view>
			<input type="text" placeholder="请输入营业执照编号" class="inp-box" v-model="formData.licenseCode">
		</view>
		<view class="flex item-center m-t-b-10">
			<view class="label-box">营业执照有效期：</view>
			<uni-data-checkbox selectedColor="rgba(0, 174, 255, 1)" selectedTextColor="rgba(0, 174, 255, 1)"
				v-model="formData.licenseValidityType" :localdata="dirctionList.certValidityType" />
		</view>
		<view class="flex item-center m-t-b-10">
			<view class="label-box">营业执照有效期开始日期：</view>
			<uni-datetime-picker placeholder="请选择营业执照有效期开始日期" v-model="formData.licenseBeginDate" type="date">
				<view class="inp-box flex justify-between item-center">
					<text>{{formData.licenseBeginDate}}</text>
					<image src="../../svg/icon-date.svg" mode="widthFix" class="icon-date"></image>
				</view>
			</uni-datetime-picker>
		</view>
		<view class="flex item-center m-t-b-10" v-if="formData.licenseValidityType == 0">
			<view class="label-box">营业执照有效期结束日期：</view>
			<uni-datetime-picker placeholder="请选择营业执照有效期结束日期" v-model="formData.licenseEndDate" type="date" :start="formData.licenseBeginDate">
				<view class="inp-box flex justify-between item-center">
					<text>{{formData.licenseEndDate}}</text>
					<image src="../../svg/icon-date.svg" mode="widthFix" class="icon-date"></image>
				</view>
			</uni-datetime-picker>
		</view>
		<view class="flex item-center m-t-b-10">
			<view class="label-box">成立时间：</view>
			<uni-datetime-picker placeholder="请选择成立时间" v-model="formData.foundDate" type="date">
				<view class="inp-box flex justify-between item-center">
					<text>{{formData.foundDate}}</text>
					<image src="../../svg/icon-date.svg" mode="widthFix" class="icon-date"></image>
				</view>
			</uni-datetime-picker>
		</view>
		<view class="flex item-center m-t-b">
			<view class="label-box">注册资本：</view>
			<input type="text" placeholder="请输入注册资本" class="inp-box" v-model="formData.regCapital">
		</view> -->
		<!-- <view class="flex item-center m-t-b">
			<view class="label-box">经营范围：</view>
			<input type="text" placeholder="请输入经营范围" class="inp-box" v-model="formData.businessScope">
		</view> -->
		<!-- <view class="flex item-center m-t-b">
			<view class="label-box">注册地址：</view>
			<picker class="inp-box" mode="multiSelector" range-key="localName" :value='regCity'
				@columnchange="onnodeclick($event,'registerCity')"
				:range="[dirctionList.hfProviceList,cityList,countryList]"
				@change="changeProvice($event,'registerCity')">
				<view :style="{color:formData.regProvinceName?'':'#A5A7A9'}" class="flex item-center justify-between">
					<text> {{formData.regProvinceName ? 
					formData.regProvinceName + (formData.regCityName?'/'+formData.regCityName:'')+(formData.regCountyName?'/'+formData.regCountyName:'')
					: '请选择注册地址'}}</text>
					<uni-icons type="down" size="20" color="#A5A7A9"></uni-icons>
				</view>
			</picker>
		</view> -->

		<!-- <view class="flex item-center m-t-b">
			<view class="label-box">注册详细地址：</view>
			<input type="text" placeholder="请输入注册详细地址" class="inp-box" v-model="formData.regAddress">
		</view> -->
		<view class="flex item-center m-t-b">
			<view class="label-box"  style="width: 80px;">经营地址：</view>
			<picker class="inp-box" mode="multiSelector"   :class="{'unactive':unActiveRule('businessProvinceName')}" range-key="localName" :value='regCity'
				@columnchange="onnodeclick($event,'businessCity')"
				:range="[dirctionList.hfProviceList,cityList,countryList]"
				@change="changeProvice($event,'businessCity')">
				<view :style="{color:formData.businessProvinceName?'':'#A5A7A9'}"
					class="flex item-center justify-between">
					<text> {{formData.businessProvinceName ? 
					formData.businessProvinceName + (formData.businessCityName?'/'+formData.businessCityName:'')+(formData.businessCountyName?'/'+formData.businessCountyName:'')
					: '请选择经营地址'}}</text>
					<uni-icons type="down" size="20" color="#A5A7A9"></uni-icons>
				</view>
			</picker>
		</view>
		<view class="flex item-center m-t-b">
			<view class="label-box">经营详细地址：</view>
			<input type="text" placeholder="请输入经营详细地址"  :maxlength="256" :class="{'unactive':unActiveRule('businessAddress')}" class="inp-box" v-model="formData.businessAddress">
		</view>
		<!-- <view class="flex item-center m-t-b">
			<view class="label-box">客服电话：</view>
			<input type="number" placeholder="请输入客服电话" class="inp-box" v-model="formData.customerMobile">
		</view> -->
		<view class="flex item-center m-t-b">
			<view class="label-box">联系人姓名：</view>
			<input type="text" placeholder="请输入联系人真实姓名" class="inp-box" :class="{'unactive':unActiveRule('contactName')}" v-model="formData.contactName">
		</view>
		<view class="flex item-center m-t-b">
			<view class="label-box">联系人手机号：</view>
			<input type="number" placeholder="请输入联系人实名过的手机号" class="inp-box" v-model="formData.contactMobileNo" :class="{'unactive':unActiveRule('contactMobileNo')}">
		</view>
		<view class="flex item-center m-t-b">
			<view class="label-box">联系人电子邮箱：</view>
			<input type="text" placeholder="请输入联系人邮箱" class="inp-box" v-model="formData.contactEmail" :class="{'unactive':unActiveRule('contactEmail')}">
		</view>
		<view class="mt-20">
			<view class="label-box">管理员信息：</view>
			<view class="inp-box flex item-center justify-between ">
				<view>系统管理员：</view>
				<view>{{formData.mobile}}</view>
				<!-- <button v-else class="h-30 leading-30 radius-23 bg-primary text-white fs-16 font-semibold" :open-type="'getPhoneNumber'"
					style="line-height: 30px;margin: 0;"				@getphonenumber="getPhoneNumber">获取手机号</button> -->
			</view>
		<!-- 	<view class="inp-box flex item-center justify-between no-top-bor">
				<view>登录密码：</view>
				<input type="password" style="text-align: right;" v-model="formData.loginPass" placeholder="请输入登录密码" :class="{'unactive':unActiveRule('loginPass')}">
			</view> -->
			<view class="tip-title">默认当前授权账号为系统管理员，使用该手机号登录商户账号</view>
		</view>

		<view class="mt-20">
			<view class="label-box">线下经营-门头照：</view>
			<view style="margin:10px 0px 10px 100px; width: 80px;">
				<uni-file-picker limit="1" :image-styles="imageStyles" v-model='headerFileList'
					@select="selectImg($event,'header')" @delete="delImg($event,'header')">
					<view class="upload-box flex flex-col item-center justify-center"  :class="{'unactive':unActiveRule('storeHeaderPicUrl')}">
						<uni-icons type="plusempty" size="27" color="rgba(51, 51, 51, 0.6)"></uni-icons>
						上传图片
					</view>
				</uni-file-picker>
			</view>
		</view>
		<view class="mt-20">
			<view class="label-box">线下经营-内景照：</view>
			<view style="margin:10px 0px 10px 100px; width: 80px;">
				<uni-file-picker limit="1" :image-styles="imageStyles" v-model='IndoorFileList'
					@select="selectImg($event,'Indoor')" @delete="delImg($event,'Indoor')">
					<view class="upload-box flex flex-col item-center justify-center"  :class="{'unactive':unActiveRule('storeIndoorPicUrl')}">
						<uni-icons type="plusempty" size="27" color="rgba(51, 51, 51, 0.6)"></uni-icons>
						上传图片
					</view>
				</uni-file-picker>
			</view>
		</view>
		<view class="mt-20">
			<view class="label-box">线下经营-收银台：</view>
			<view style="margin:10px 0px 10px 100px; width: 80px;">
				<uni-file-picker limit="1" :image-styles="imageStyles" v-model='cashierDeskFileList'
					@select="selectImg($event,'cashierDesk')" @delete="delImg($event,'cashierDesk')">
					<view class="upload-box flex flex-col item-center justify-center"  :class="{'unactive':unActiveRule('storeCashierDeskPicUrl')}">
						<uni-icons type="plusempty" size="27" color="rgba(51, 51, 51, 0.6)"></uni-icons>
						上传图片
					</view>
				</uni-file-picker>
			</view>
		</view>
		<!-- <popupRegion ref="popup"></popupRegion> -->
		<view class="k-page"></view>
		<view class="btn-box">
			<view class="release-btn" @click="nextStep">下一步</view>
		</view>
	</view>
</template>

<script setup>
	import uniDataCheckbox from '@/applyPages/uni_modules/uni-data-checkbox/components/uni-data-checkbox/uni-data-checkbox.vue';
	import uniIcons from '@/applyPages/uni_modules/uni-icons/components/uni-icons/uni-icons.vue';
	import uniDataSelect  from '@/applyPages/uni_modules/uni-data-select/components/uni-data-select/uni-data-select.vue';
	import {
		ref,
		onMounted,
		watch
	} from 'vue'
	import {
		uploadFileApi,
		hfUploadFileProgressApi,
		uploadProgressApi,
		hfUploadFileApi,
		getHfRegionsByIdApi,
		getHfMccById
	} from '@/api/common.js'
	import {
		useUserStore
	} from '@/stores/modules/user.js'
	import {
		checkPhoneNumber,
		validateEmail,
		ocrImage
	} from '@/utils/index.js'
	import {getFileNameExtName, getFileNameAndExtension} from '@/applyPages/api/common.js'
	import {
		getWxMobileApi 
	} from '@/api/auth.js'
	const userStore = useUserStore()
	// let user = ref(userStore.$state.userInfo.mobile)
	let systemInfo = uni.getSystemInfoSync()
	let sysW = ref()
	sysW.value = systemInfo.windowWidth - 40
	let popup = ref()
	const formRule = ref(false)
	const props = defineProps({
		detail: {
			type: Object //字典
		},
	})
	const imageStyles = ref({
		width: 80,
		height: 80,
		border: {
			color: "rgba(51, 51, 51, 0.6)",
			width: '0px',
			style: 'dashed',
			radius: '2px'
		}
	})
	const mcc = ref({
		level1: null,
		level2: null
	})
	const show = ref(false)
	const emit = defineEmits(['nextStep'])
	const formData = ref({
		merchantName: '', //商家名称
		merchantShortName: '', //商家简称
		mcc: '', //所属行业code
		mccName: '', //所属行业名称
		mccOneId:'',
		mccTwoId:'',
		logo: '', //商家logo
		businessCityCode: '', //经营市code
		businessCityName: '', //经营市名称
		businessCountyCode: '', //经营区县code
		businessCountyName: '', //经营区县名称
		businessProvinceCode: '', //经营省份code
		businessProvinceName: '', //经营省份名称
		businessAddress: '', //经营详细地址
	
		contactName: '', //联系人姓名
		contactMobileNo: '', //联系人手机号
		contactEmail: '', //联系人电子邮箱
		// customerMobile: '', //客服电话
		
		// businessScope: '', //经营范围
		storeHeaderPic: '', //线下经营-门头照
		storeHeaderPicUrl: '', //线下经营-门头照图片地址
		storeIndoorPic: '', //线下经营-内景照
		storeIndoorPicUrl: '', //线下经营-内景照图片地址
		storeCashierDeskPic: '', //线下经营-收银台
		storeCashierDeskPicUrl: '', //线下经营-收银台图片地址
		
		mccLevel2Name:'',
		mccLevel1Name:'',
		
		mobile:''
		// loginPass:''//密码
	})
	const changeName = () => {
		if(!formData.value.merchantShortName){
			formData.value.merchantShortName = formData.value.merchantName
		}
	}
	let dirctionList = ref({
		companyType: [],
		certValidityType: [],
		certType: [],
		cardType: [],
		mccType: [],
		hfMccList: [],
		level2: [],
		level3: [],
		hfProviceList: []
	})
	let cityList = ref([])
	let countryList = ref([])
	let logoFileList = ref([])
	let licensePicFileList = ref([])
	const getCommonData = () => {
		// listCertType(), listCardType(),
		Promise.all([getHfMccById(0), getHfRegionsByIdApi(0)])
			.then(async (result) => {
				if (result.length) {
					// dirctionList.value = {
						dirctionList.value.hfMccList = result[0].map(item => {
							return {
								text: item.mccName,
								value: item.id
							}
						})
						dirctionList.value.hfProviceList = result[1].map(item => {
							item.children = []
							return item
						})
					// }
					// selPro.value = result[4][0]
					getHfRegionsByIdApi(result[1][0].id).then(res => {
						dirctionList.value.hfProviceList[0].children = res || []
						cityList.value = res || []
						getHfRegionsByIdApi(res[0].id).then(data => {
							countryList.value = data || []
						})
					})
					// if(result){
					// 	dirctionList.value.hfProviceList[0].children =  result
					// }
				}
				// console.log(result, 'a')
			})
	}
	const getMccListById = async (id, type) => {
		let result = await getHfMccById(id)
		if (result) {
			dirctionList.value[type] = result.map(item => {
				return {
					text: item.mccName,
					value: type=='level3'? item.mccCode: item.id
				}
			})
		}
	}
	const changeCompany = (e, type) => {
		if (type == 'hfmcclevel1') {
			let arr = dirctionList.value.hfMccList.filter(item => {
				if (item.value == e) {
					return item
				}
			})
			mcc.value.level1 = e
			dirctionList.value.level2 = []
			dirctionList.value.level3 = []
			formData.value.mcc = ''
			formData.value.mccName = ''
			formData.value.mccOneId = e
			formData.value.mccLevel1Name = arr[0].text
			getMccListById(e, 'level2')
		} else if (type == 'hfmcclevel2') {
			mcc.value.level2 = e
			formData.value.mccTwoId = e
			dirctionList.value.level3 = []
			formData.value.mcc = ''
			formData.value.mccName = ''
			getMccListById(e, 'level3')
			dirctionList.value.level2.forEach(item => {
				if (item.value == e) {
					formData.value.mccLevel2Name = item.text
				}
			})
		} else if (type == 'hfmcclevel3') {
			dirctionList.value.level3.forEach(item => {
				if (item.value == e) {
					formData.value.mccName = item.text
				}
			})
			formData.value.mcc = e
			// mcc: '', //所属行业code
			// mccName: '', //所属行业名称
		} else {
			formData.value.companyType = e
		}
	}
	const regCity = ref([0, 0, 0])
	const selPro = ref({})
	const onnodeclick = async (e, type) => {
		if (e.detail.column == 0) {
			let obj = dirctionList.value.hfProviceList[e.detail.value]
			selPro.value = obj
			if (obj.children && obj.children.length) {
				cityList.value = obj.children
				if (obj.children[0].children && obj.children[0].children.length) {
					countryList.value = obj.children[0].children
				} else {
					let list = await getHfRegionsByIdApi(obj.children[0].id)
					countryList.value = list
				}
			} else {
				let result = await getHfRegionsByIdApi(obj.id)
				if (result) {
					dirctionList.value.hfProviceList.forEach(item => {
						if (item.id == obj.id) {
							item.children = result
						}
					})
					cityList.value = obj.children
					let list = await getHfRegionsByIdApi(obj.children[0].id)
					countryList.value = list
				}
			}
		} else if (e.detail.column == 1) {
			let obj = cityList.value[e.detail.value]
			if (obj.children && obj.children.length) {
				countryList.value = obj.children
			} else {
				let result = await getHfRegionsByIdApi(obj.id)
				if (result) {
					cityList.value.forEach(item => {
						if (item.id == obj.id) {
							item.children = result
						}
					})
					dirctionList.value.hfProviceList.forEach(item => {
						if (item.id == selPro.value) {
							item.children = cityList.value
						}
					})
					countryList.value = obj.children
				}
			}
		} else if (e.detail.column == 2) {
			// regCity.value[2] = e.detail.value
			let obj = countryList.value[e.detail.value]
		}

	}
	const changeProvice = (e, type) => {
		regCity.value = e.detail.value
		if (type == 'registerCity') {
			// regCityCode: '', //注册市code
			// regCityName: '', //注册市名称
			// regCountyCode: '', //注册区县code
			// regCountyName: '', //注册区县名称
			// regProvinceCode: '', //注册省份code
			// regProvinceName: '', //注册省份名称
			formData.value.regProvinceCode = dirctionList.value.hfProviceList[regCity.value[0]].code
			formData.value.regProvinceName = dirctionList.value.hfProviceList[regCity.value[0]].localName
			formData.value.regCityCode = cityList.value[regCity.value[1]].code
			formData.value.regCityName = cityList.value[regCity.value[1]].localName
			formData.value.regCountyCode = countryList.value[regCity.value[2]].code
			formData.value.regCountyName = countryList.value[regCity.value[2]].localName
		} else {
			// businessCityCode: '', //经营市code
			// businessCityName: '', //经营市名称
			// businessCountyCode: '', //经营区县code
			// businessCountyName: '', //经营区县名称
			// businessProvinceCode: '', //经营省份code
			// businessProvinceName: '', //经营省份名称
			formData.value.businessProvinceCode = dirctionList.value.hfProviceList[regCity.value[0]].code
			formData.value.businessProvinceName = dirctionList.value.hfProviceList[regCity.value[0]].localName
			formData.value.businessCityCode = cityList.value[regCity.value[1]].code
			formData.value.businessCityName = cityList.value[regCity.value[1]].localName
			formData.value.businessCountyCode = countryList.value[regCity.value[2]].code
			formData.value.businessCountyName = countryList.value[regCity.value[2]].localName
		}
		// console.log(e,'eeee')
	}
	let cashierDeskFileList = ref([])
	let headerFileList = ref([])
	let IndoorFileList = ref([])
	// 删除图片
	const delImg = (e, type) => {
		if (type == 'logo') {
			formData.value.logo = ''
			logoFileList.value = []
		} else if (type == 'licensePic') { //营业执照
			formData.value.licensePicUrl = ''
			formData.value.licensePic = ''
			licensePicFileList.value = []
		} else if (type == 'cashierDesk') {
			formData.value.storeCashierDeskPicUrl = ''
			formData.value.storeCashierDeskPic = ''
			cashierDeskFileList.value = []
		} else if (type == 'header') {
			formData.value.storeHeaderPicUrl = ''
			formData.value.storeHeaderPic = ''
			headerFileList.value = []
		} else if (type == 'Indoor') {
			formData.value.storeIndoorPicUrl = ''
			formData.value.storeIndoorPic = ''
			IndoorFileList.value = []
		}
	}
	// 图片上传
	const load = {
		logo:false,
		licensePic:false,
		cashierDesk:false,
		header:false,
		Indoor:false
	}
	const selectImg = async (e, type) => {
		// uni.showLoading()
		let tempFiles = e.tempFiles[0]
		let files = e.tempFilePaths
		let result = null
		load[type] = true
		// if (tempFiles.size > 5 * 1024 * 1024) {
		// 	uni.showToast({
		// 		icon: 'none',
		// 		title: '图片不可大于5M'
		// 	})
		// 	delImg(e, type)
		// 	return
		// }
		if (type == 'logo') {
			uploadProgressApi(1, {
				filePath: files[0],
				name: 'file',
				complete: (uploadFileRes) => {
					load[type] = false
					result = uploadFileRes.data && JSON.parse(uploadFileRes.data)
					if (uploadFileRes.statusCode === 200) {
						if(result.data && result.code == 200){
							let item = {
								url: result.data,
								name: tempFiles.name,
								extname: tempFiles.extname
							}
							formData.value.logo = result.data
							logoFileList.value = [item]
						}else{
							delImg(e, type)
							uni.showToast({
								icon: 'none',
								title: result.message
							})
						}
							
					} else {
						delImg(e, type)
						uni.showToast({
							icon: 'none',
							title: '上传失败'
						})
					}
				}
			},(pro) => {
				if(pro.progress){
					tempFiles.progress = pro.progress
					logoFileList.value = [tempFiles]
				}
				
			})
		} else {
			let typeStr = type == 'licensePic' ? 'F07' : type == 'cashierDesk' ? 'F105' : type == 'header' ?
				'F22' : type == 'Indoor' ? 'F24' : ''
			hfUploadFileProgressApi(typeStr, {
				filePath: files[0],
				name: 'file',
				complete: (uploadFileRes) => {
					load[type] = false
					result = uploadFileRes.data && JSON.parse(uploadFileRes.data)
					if (uploadFileRes.statusCode === 200) {
						if(result.data && result.code == 200){
							let item = {
								url: result.data.imgUrl,
								name: tempFiles.name,
								extname: tempFiles.extname
							}
							if (type == 'licensePic') { //营业执照
								formData.value.licensePicUrl = result.data.imgUrl
								formData.value.licensePic = result.data.fileId
								licensePicFileList.value = [item]

								ocrImage(result.data.imgUrl,7).then(invokeRes=>{
									const {data:{biz_license_res}} = invokeRes;
									formData.value.licenseCode = biz_license_res.reg_num.text;
									formData.value.foundDate = biz_license_res.registered_date.text?.replace(/年|月/g,'-')?.replace(/日/g,'');
									formData.value.regCapital = biz_license_res.registered_capital.text;
									formData.value.businessScope = biz_license_res.business_scope.text;
									formData.value.regAddress = biz_license_res.address.text;
									formData.value.businessAddress = biz_license_res.address.text;
								}).catch(err=>console.log({err}))
							} else if (type == 'cashierDesk') {
								formData.value.storeCashierDeskPicUrl = result.data.imgUrl
								formData.value.storeCashierDeskPic = result.data.fileId
								cashierDeskFileList.value = [item]
							} else if (type == 'header') {
								formData.value.storeHeaderPicUrl = result.data.imgUrl
								formData.value.storeHeaderPic = result.data.fileId
								headerFileList.value = [item]
							} else if (type == 'Indoor') {
								formData.value.storeIndoorPicUrl = result.data.imgUrl
								formData.value.storeIndoorPic = result.data.fileId
								IndoorFileList.value = [item]
							}
						}else{
							delImg(e, type)
							uni.showToast({
								icon: 'none',
								title: result.message
							})
						}
							
					} else {
						delImg(e, type)
						uni.showToast({
							icon: 'none',
							title: '上传失败'
						})
					}
				}
			},(pro) => {
				if(!pro.progress) return
				tempFiles.progress = pro.progress
				if (type == 'licensePic') { //营业执照
					licensePicFileList.value = [tempFiles]
				} else if (type == 'cashierDesk') {
					cashierDeskFileList.value = [tempFiles]
				} else if (type == 'header') {
					headerFileList.value = [tempFiles]
				} else if (type == 'Indoor') {
					IndoorFileList.value = [tempFiles]
				}
			})

		}
		
	}
	
	const nextStep = () => {
		const formDataTip = {
			merchantName: '请输入商户名称', //商家名称
			merchantShortName: '请输入商户简称', //商家简称
			mcc: '请选择所属行业', //所属行业code
			logo: '请选择商家logo', //商家logo
			
			businessCityCode: '请选择经营地址', //经营市code
			// businessCityName: '', //经营市名称
			businessCountyCode: '请选择经营地址', //经营区县code
			// businessCountyName: '', //经营区县名称
			businessProvinceCode: '请选择经营地址', //经营省份code
			// businessProvinceName: '', //经营省份名称
			businessAddress: '请输入经营详细地址', //经营详细地址
			
			contactName: '请输入联系人真实姓名', //联系人姓名
			contactMobileNo: '请输入联系人实名过的手机号', //联系人手机号
			contactEmail: '请输入联系人电子邮箱', //联系人电子邮箱
			
			mobile:'请获取管理员手机号',
			// loginPass:'请输入密码',
			// contactCertNo: '', //联系人身份证号
			
			// customerMobile: '请输入客服电话', //客服电话
			

			// businessScope: '请输入经营范围', //经营范围
			storeCashierDeskPicUrl: '请选择线下经营-收银台图片', //线下经营-收银台图片地址
			// storeHeaderPic: '', //线下经营-门头照
			storeHeaderPicUrl: '请选择线下经营-门头照图片', //线下经营-门头照图片地址
			// storeIndoorPic: '', //线下经营-内景照
			storeIndoorPicUrl: '请选择线下经营-内景照图片', //线下经营-内景照图片地址
		}
		let flag = null,title=''
		Object.keys(formData.value).forEach(key => {
			if(!flag){
				if ((!formData.value[key] && String(formData.value[key]) != '0') && formDataTip[key]) {
					flag = key
				}
				if(!flag && key == 'businessAddress' && formData.value[key].length<4){
					title = '经营详细地址字数范围在4-256字'
					flag = key
				}
				if(!flag){
					if(key == 'contactMobileNo' && !checkPhoneNumber(formData.value[key])){
						title = '请输入正确的联系人手机号'
						flag = key
					}
				}
				if(!flag){
					if(key == 'contactEmail' && !validateEmail(formData.value[key])){
						title = '请输入正确的邮箱地址'
						flag = key
					}
				}
				
				
			}
			
		})
		if (flag) {
			formRule.value =true
			let showTitle = title||formDataTip[flag]
			switch (flag){
				case 'logo':
					if(load.logo){
						showTitle='图片上传中...'
					}
				break;
				case 'licensePic':
					if(load.licensePic){
						showTitle='图片上传中...'
					}
				break;
				
				case 'storeCashierDeskPicUrl':
					if(load.cashierDesk){
						showTitle='图片上传中...'
					}
				break;
				case 'storeHeaderPicUrl':
					if(load.header){
						showTitle='图片上传中...'
					}
				break;
				case 'storeIndoorPicUrl':
					if(load.Indoor){
						showTitle='图片上传中...'
					}
				break;
			}
			uni.showToast({
				icon: 'none',
				title: showTitle
			})
			return
		}else{
			formRule.value = false
		}
		emit('nextStep', {data:formData.value,step:2})
	}
	const unActiveRule = (name) => {
		if(formRule.value){
			if(!formData.value[name] && String(formData.value[name]) != '0'){
				return true
			}
		}
		return false
	}
	const setImg = () => {
		if(props.detail.logo){
			let item = {
					url: props.detail.logo,
					name: getFileNameAndExtension(props.detail.logo),
					extname: getFileNameExtName(props.detail.logo)
				}
				logoFileList.value = [item]
		}
		if(props.detail.licensePicUrl){
			let item = {
					url: props.detail.licensePicUrl,
					name: getFileNameAndExtension(props.detail.licensePicUrl),
					extname: getFileNameExtName(props.detail.licensePicUrl)
				}
				licensePicFileList.value = [item]
		}
		if(props.detail.storeCashierDeskPicUrl){
			let item = {
					url: props.detail.storeCashierDeskPicUrl,
					name: getFileNameAndExtension(props.detail.storeCashierDeskPicUrl),
					extname: getFileNameExtName(props.detail.storeCashierDeskPicUrl)
				}
				cashierDeskFileList.value = [item]
		}
		if(props.detail.storeHeaderPicUrl){
			let item = {
					url: props.detail.storeHeaderPicUrl,
					name: getFileNameAndExtension(props.detail.storeHeaderPicUrl),
					extname: getFileNameExtName(props.detail.storeHeaderPicUrl)
				}
				headerFileList.value = [item]
		}
		if(props.detail.storeIndoorPicUrl){
			let item = {
					url: props.detail.storeIndoorPicUrl,
					name: getFileNameAndExtension(props.detail.storeIndoorPicUrl),
					extname: getFileNameExtName(props.detail.storeIndoorPicUrl)
				}
				IndoorFileList.value = [item]
		}
	}
	watch(() => props.detail,(val) => {
		if(val.id){
			Object.keys(formData.value).forEach(key => {
				formData.value[key] = val[key]
				if(key=='mccOneId'&& val[key]){
					getMccListById(val[key], 'level2')
				}
				if(key=='mccTwoId'&& val[key]){
					getMccListById(val[key], 'level3')
				}
			})
			setImg()
			emit('nextStep', {data:formData.value,step:1})
		}
		
	})
	const getPhoneNumber = async () => {
		// console.log(uni.getStorageSync('wxPhone'),'222')
		formData.value.mobile = uni.getStorageSync('wxPhone')
	}
	onMounted(() => {
		if(!formData.value.mobile && uni.getStorageSync('wxPhone')){
			getPhoneNumber()
		}
		getCommonData()
	})
</script>
<style>
	.select-box .uni-stat__select {
		background: rgba(245, 245, 245, 1);
	}
</style>
<style lang="scss" scoped>
	.base-page {
		padding: 20px;
		background-color: #ffffff;
	}

	.base-title {
		font-size: 20px;
		font-weight: 600;
		line-height: 28px;
		margin-bottom: 10px;
	}

	.label-box {
		font-size: 14px;
		font-weight: 600;
		line-height: 20px;
		color: rgba(51, 51, 51, 1);
		margin: 6px 0;
	}

	.inp-box {
		background: rgba(245, 245, 245, 1);
		height: 44px;
		border-radius: 12px;
		padding: 0 10px;
		line-height: 44px;
		border: 1px solid rgba(245, 245, 245, 1);
		&.unactive{
			border-color:#FA4543;
		}
	}

	.tip-title {
		font-size: 12px;
		font-weight: 400;
		line-height: 17px;
		color: rgba(51, 51, 51, 0.6);
		margin-top: 4px;
	}

	.select-box {
		background: rgba(245, 245, 245, 1);
	}

	.upload-box {
		width: 100%;
		height: 100%;
		border: 1px dashed rgba(51, 51, 51, 0.6);
		background-color: rgba(245, 245, 245, 1);
		border-radius: 12px;
		font-size: 12px;
		color: rgba(51, 51, 51, 0.6);
		&.unactive{
			border-color:#FA4543;
		}
	}

	.icon-date {
		width: 16px;
	}

	.m-t-b {
		margin: 10px 0;

		.label-box {
			width: 70px;
		}

		.inp-box {
			margin-left: 10px;
			width: calc(100% - 80px);
		}
	}

	.m-t-b-10 {
		margin: 10px 0;
	}

	.release-btn {
		// width: 343px;
		height: 46px;
		padding: 12px, 20px, 12px, 20px;
		border-radius: 8px;
		// gap: 10px;
		background: #FA4543;
		color: #ffffff;
		margin: 10px 20px;
		text-align: center;
		line-height: 46px;

		&.unactive {
			background: rgba(169, 171, 172, 1);
		}
	}

	.k-page {
		height: 120px;
	}

	.btn-box {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		background-color: #ffffff;
		z-index: 7;
		padding: 10px 0;
	}
	.no-bottom-bor{
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
	}
	.no-top-bor{
		border-top-left-radius: 0;
		border-top-right-radius: 0;
	}
</style>